<!DOCTYPE html>
<html>
    <head>
        <title>哈哈哈哈</title>
        <meta charset="utf-8">
        <style>
            *{
                margin: 0;
                
                
            }
            p{
                border: solid lightblue  ;
                background-color: aquamarine;
                font:italic 30px;
                padding: 34px;
                width: auto;
                letter-spacing: 9px;
                


            }
            p:hover{
                background-color: aqua;
            }
div{
    text-align: center;
    
 
}
            h1{
                display: none;
                position: relative;
                background-color: antiquewhite;
                opacity: 0.7;
                border: inset 5px pink;


            }
            h1 span{
                border: groove 4px yellow;
                opacity: 0.9;
            }
        div:hover h1,div:hover img{
                display: block;
            }
            
            img{
                
                width: 100%;
                height: 100%;
                display: none;
                position: absolute;
                top:0;
                z-index: -1;
            }
        </style>
    </head>
    <body>
       <div> <p>悬停在我的上面可以看见：</p>
        <h1><span>🐏 🕊</span>,你好啊！</h1>
    <img src="bb.jpg"/> </div>
    </body>
</html>